/**
 * @Description: 处理柱状图
 * @Author bianpengfei
 * @create 2022/9/16 13:59
 */

import { formatAxisLabel } from '@base/chart/utils'

export default {
  handler() {
    const [data] = arguments

    const enhancerValueY1 = this._enhancerDataObj['valuey1']
    const enhancerValueY2 = this._enhancerDataObj['valuey2']
    const enhancerValueZ1 = this._enhancerDataObj['valuez1']
    const enhancerValueZ2 = this._enhancerDataObj['valuez2']

    return {
      legend: {
        show: true,
        orient: 'horizontal',
        itemHeight: 8,
        itemWidth: 14,
        itemGap: 30
      },
      grid: {
        left: 50
      },
      xAxis: [
        {
          type: 'category',
          data: this._dataObj[`name`],
          axisTick: {
            alignWithLabel: true
          },
          axisLabel: {
            show: true,
            fontSize: 9,
            rotate: 30,
            interval: '0',
            formatter: (text) => {
              return formatAxisLabel(text, 3)
            }
          },
          splitLine: {
            // 不显示分割线
            show: false
          }
        }
      ],
      yAxis: [
        enhancerValueY1 && {
          name: enhancerValueY1.unit,
          type: 'value',
          nameTextStyle: {
            align: 'left',
            fontSize: 10
          },
          splitNumber: 3,
          splitLine: {
            // 显示分割线
            show: true
          },
          axisLabel: {
            fontSize: 10,
            formatter: (data) => {
              return `${data}`
            }
          }
        },
        enhancerValueZ1 && {
          name: enhancerValueZ1.unit,
          show: true,
          type: 'value',
          nameTextStyle: {
            align: 'right',
            fontSize: 10
          },
          splitLine: {
            show: true,
            lineStyle: {
              type: 'dotted'
            }
          },
          axisLabel: {
            fontSize: 10,
            formatter: (data) => {
              return `${data}`
            }
          }
        }
      ].filter(Boolean),
      // dataZoom: [
      //   {
      //     show: true,
      //     height: 20,
      //     xAxisIndex: [0],
      //     bottom: 0,
      //     // handleSize: '100%',
      //     handleStyle: {
      //       color: this.colors[0]
      //     },
      //     textStyle: {
      //       color: 'rgb(108,175,201)'
      //     },
      //     fillerColor: 'rgb(179, 216, 255)',
      //     borderColor: 'rgba(204,187,225,0.5)'
      //   },
      //   {
      //     type: 'inside',
      //     show: true,
      //     height: 15,
      //     start: 1,
      //     end: 35
      //   }
      // ],
      series: [
        enhancerValueY1 && {
          name: enhancerValueY1.name,
          type: 'bar',
          data: this._dataObj[`valuey1`],
          itemStyle: {
            color: enhancerValueY1.color
          },
          symbol: 'circle',
          barMaxWidth: '14',
          label: {
            show: true,
            textStyle: {
              color: '#333'
            },
            fontSize: 8,
            formatter: (data) => {
              if (String(data.value).includes('.')) return (+data.value || 0).toFixed(2)
              return +data.value || 0
            }
          }
        },
        enhancerValueY2 && {
          name: enhancerValueY2.name,
          type: 'bar',
          data: enhancerValueY2.data,
          itemStyle: {
            color: enhancerValueY2.color
          },
          symbol: 'circle',
          barMaxWidth: '14',
          label: {
            show: true,
            textStyle: {
              color: '#333'
            },
            fontSize: 8,
            formatter: (data) => {
              if (String(data.value).includes('.')) return (+data.value || 0).toFixed(2)
              return +data.value || 0
            }
          }
        },
        enhancerValueZ1 && {
          name: enhancerValueZ1.name,
          showSymbol: true,
          symbol: 'circle',
          lineStyle: {
            width: 1, // 线宽是0
            // color: !this.ifYaxisLineShow ? 'rgba(0, 0, 0, 0)' : '#fdd56a' // 线的颜色是透明的
            color: enhancerValueZ1.color // 线的颜色是透明的
          },
          type: 'line',
          yAxisIndex: 1, // 索引从0开始
          data: this._dataObj[`valuez1`],
          itemStyle: {
            color: enhancerValueZ1.color || '#07c160'
          },
          label: {
            show: true,
            textStyle: {
              color: '#333'
            },
            fontSize: 8,
            formatter: (data) => {
              return data.value + enhancerValueZ1.unit
            }
          }
        },
        enhancerValueZ2 && {
          name: enhancerValueZ2.name,
          showSymbol: true,
          symbol: 'circle',
          lineStyle: {
            width: 1, // 线宽是0
            // color: !this.ifYaxisLineShow ? 'rgba(0, 0, 0, 0)' : '#fdd56a' // 线的颜色是透明的
            color: enhancerValueZ2.color // 线的颜色是透明的
          },
          type: 'line',
          yAxisIndex: 1, // 索引从0开始
          data: this._dataObj[`valuez2`],
          itemStyle: {
            color: enhancerValueZ2.color
          },
          label: {
            show: true,
            textStyle: {
              color: '#333'
            },
            fontSize: 8,
            formatter: (data) => {
              return data.value + enhancerValueZ2.unit
            }
          }
        }
      ].filter(Boolean)
    }
  }
}
